{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="{% static 'plugins/bootstrap-3.4.1-dist/css/bootstrap.css' %}">
    <style>
        .account{
            width:400px;
            border:1px solid #dddddd;
            border-radius:5px;
            box-shadow:5px 5px 20px #aaa;

            margin-left:auto;
            margin-right:auto;
            margin-top:100px;
            padding:20px 40px;
        }
        .account h2{
            margin-top:10px;
            text-align:center;
        }
    </style>
</head>
<body>
<div class="account">
    <h2>用户登录</h2>
    <form method="post" novalidate>
        {% csrf_token %}
        <div class="form-group">
            <label>用户名</label>
{#            <label type="text" class="form-control"  placejolder="用户名"></label>#}
            {{ form.username }}
            <span style="color:red">
                {{ form.username.errors.0 }}
            </span>
        </div>
        <div class="form-group">
            <label for="exampleInputEmail">密码</label>
{#            <label type="email" class="form-control" id="exampleInputEmail" placejolder="用户名"></label>#}
            {{ form.password}}
            <span style="color:red">{{ form.password.errors.0 }}</span>
        </div>
        <div class="form-group">
            <label for="id_code">图片验证</label>
            <div class="row">
                <idv class="col-xs-7">
                    {{ form.code}}
            <span style="color:red">{{ form.code.errors.0 }}</span>
                </idv>
                <div class="col-xs-5">
{#                    <image id="image_code" src="{% static 'img/code.png' %}" style="width:125px;height:40px;"></image>#}
                    <image id="image_code" src="/image/code/" style="width:125px;height:40px;"></image>
                </div>
            </div>
        </div>
        <input type="submit" value="登 录" class="btn btn-primary">
    </form>
</div>

</body>
</html>